import { startLoading, stopLoading } from '@/utils/loading'
import { createRouter, createWebHistory } from 'vue-router'

const router = createRouter({
  history: createWebHistory(import.meta.env.BASE_URL),
  routes: [
    // 主页
    {
      path: '/',
      name: 'home',
      component: () => import('../views/Home/HomeView.vue'),
    },
    // 登录界面
    {
      path: '/login',
      name: 'login',
      component: () => import('@/views/Login/LoginPage.vue'),
    },
    // 重置密码界面
    {
      path: '/forget',
      name: 'forgetPassword',
      component: () => import('@/views/Login/RepasswordPage.vue'),
    },
    // 个人信息页
    {
      path: '/user',
      name: 'userInfo',
      component: () => import('@/views/User/UserPage.vue'),
    },
    {
      path: '/science',
      name: 'science',
      redirect: '/science/greenconsumption',
      component: () => import('@/views/Science/SciencePage.vue'),
      children: [
        {
          path: '/science/greenconsumption',
          name: 'greenconsumption',
          component: () => import('@/views/Science/content/GreenConsumption.vue'),
        },
        {
          path: '/science/carbonfootprint',
          name: 'carbonfootprint',
          component: () => import('@/views/Science/content/CarbonFootprint.vue'),
        },
        {
          path: '/science/zerowaste',
          name: 'zerowaste',
          component: () => import('@/views/Science/content/ZeroWaste.vue'),
        },
        {
          path: '/science/sustainabledevelopment',
          name: 'sustainabledevelopment',
          component: () => import('@/views/Science/content/SustainableDevelopment.vue'),
        },
        {
          path: '/science/tramwaypolicy',
          name: 'tramwaypolicy',
          component: () => import('@/views/Science/content/TramwayPolicy.vue'),
        },
        {
          path: '/science/chinacontribution',
          name: 'chinacontribution',
          component: () => import('@/views/Science/content/ChinaContribution.vue'),
        },
        {
          path: '/science/globalwarming',
          name: 'globalwarming',
          component: () => import('@/views/Science/content/GlobalWarming.vue'),
        },
      ],
    },
    // 论坛主页
    {
      path: '/forum',
      name: 'forum',
      component: () => import('@/views/Forum/ForumPage.vue'),
    },
    // 帖子管理页
    {
      path: '/forum/post',
      name: 'post',
      redirect: '/forum/post/addnewpost',
      component: () => import('@/views/Forum/layout/Post.vue'),
      children: [
        {
          path: '/forum/post/addnewpost/:id?',
          name: 'addnewpost',
          component: () => import('@/views/Forum/AddNewPost.vue'),
        },
        {
          path: '/forum/post/managepost',
          name: 'managepost',
          component: () => import('@/views/Forum/ManagePost.vue'),
        },
      ],
    },
    // 商城页
    {
      path: '/shop',
      name: 'shop',
      component: () => import('@/views/Shop/ShopPage.vue'),
    },
    // 商品详细页
    {
      path: '/shop/:id',
      name: 'gooddetail',
      component: () => import('@/views/Shop/GoodsDetail.vue'),
    },
    // 购物车
    {
      path: '/shop/shopcart',
      name: 'shopcart',
      component: () => import('@/views/Shop/ShopCartPage.vue'),
    },
    // 支付页
    {
      path: '/pay',
      name: 'pay',
      component: () => import('@/views/Shop/PayPage.vue'),
    },
    // 订单页
    {
      path: '/shop/order',
      name: 'order',
      component: () => import('@/views/Shop/OrderPage.vue'),
    },
    // 管理商品页
    {
      path: '/shop/managegoods',
      name: 'managegoods',
      redirect: '/shop/managegoods/addnewgoods',
      component: () => import('@/views/Shop/layout/Goods.vue'),
      children: [
        // 添加商品
        {
          path: '/shop/managegoods/addnewgoods',
          name: 'addnewgoods',
          component: () => import('@/views/Shop/AddNewGood.vue'),
        },
        // 管理商品
        {
          path: '/shop/managegoods/manageproducts',
          name: 'manageproducts',
          component: () => import('@/views/Shop/ManageProducts.vue'),
        },
        // 管理身份
        {
          path: '/shop/managegoods/manageidentity',
          name: 'manageidentity',
          component: () => import('@/views/Shop/ManageIdentities.vue'),
        },
      ],
    },
    // 碳足迹
    {
      path: '/carbonfootprint',
      name: 'carbonfootprints',
      component: () => import('@/views/CarbonFootprint/CountPage.vue'),
    },
    // 搜索页
    {
      path: '/search/:searchQuery',
      name: 'search',
      component: () => import('@/views/Search/SearchPage.vue'),
    },
  ].map((route) => ({
    ...route,
    meta: {
      ...route.meta,
      noCache: true, // 禁止缓存
    },
  })),
})

// 路由导航标识
let isNavigationPending = false

router.beforeEach((to, from, next) => {
  // 哈希变化start则直接跳转
  if (to.hash === '#start') {
    next()
  }
  // 若存在未完成的导航则触发
  if (isNavigationPending) {
    // 页面将不会被跳转
    next(false)
  }
  // 路由变化之后设置为true，防止被重复点击
  isNavigationPending = true
  // 开启弹窗
  startLoading()
  // 确保同步任务执行完毕再方向导航
  Promise.resolve().then(() => {
    next()
    // 将标志设置为false，可以进行路由跳转了
    isNavigationPending = false
  })
})

router.afterEach(() => {
  stopLoading()
})

export default router
